<template>
    <!--显示Mod作者在根目录文件夹下放的纯文本-->
    <div id="content-header">
        {{ currentResource?.name || '' }}
    </div>
    <div v-if="currentResource && currentResource.type === 'TextFile'" class="content-data h-full overflow-hidden">
        <pre
            class="whitespace-pre overflow-auto w-full h-full p-2 bg-gray-900 rounded outline-none min-w-0">{{ currentTextContent }}</pre>
    </div>
</template>
<script setup lang="ts">
import { defineProps, watch, ref } from 'vue';
import { ResourceItem } from './types';
const props = defineProps<{ resourceItem?: ResourceItem; }>();

const currentResource = ref<ResourceItem | undefined>(props.resourceItem);
const currentTextContent = ref<string>('');

watch(() => props.resourceItem, async (newVal, oldVal) => {
    if (newVal !== oldVal) {
        // 资源项发生变化时的处理逻辑
        currentResource.value = newVal;
        if (newVal && newVal.files) {
            const modfile = newVal.files['mod'];
            if (modfile) {
                await modfile.read();
                currentTextContent.value = modfile.content || '';
            }
        }
    }
});
</script>
